<!--2)	兑奖情况日、月报表-->
<template>
  <div class="app-container">
    <!--    {{ searchObj }}-->
    <!-- banner列表 -->
    <div>
      <el-form :inline="true" :model="page" class="demo-form-inline">
        <el-form-item label="营业厅">
<!--          <el-input v-model.trim="" placeholder="岳阳"></el-input>-->
          <el-select v-model="page.acptsiteid" placeholder="请选择">
            <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="业务类型">
          <el-input v-model.trim="page.svcid" placeholder="0"></el-input>
        </el-form-item>
        <el-form-item label="奖品类型">
          <el-input v-model.trim="page.gifttype" placeholder="1"></el-input>
        </el-form-item>
        <el-form-item label="参与活动日期">
          <!--        <el-input v-model.trim="page.obtainoptrdate" placeholder="01"></el-input>-->
          <div class="block">
            <el-date-picker
                v-model="page.obtainoptrdate"
                format="yyyy-MM-dd"
                value-format="yyyy-MM-dd"
                type="date"
                placeholder="选择日期">
            </el-date-picker>
          </div>
        </el-form-item>
        <el-form-item label="领取日期">
          <div class="block">
            <el-date-picker
                v-model="page.encashoptrdate"
                format="yyyy-MM-dd"
                value-format="yyyy-MM-dd"
                type="date"
                placeholder="选择日期">
            </el-date-picker>
          </div>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="onSubmit">查询</el-button>
        </el-form-item>
        <el-form-item>
          <el-button @click="ReportDownloads()" type="primary">导出当页数据</el-button>
        </el-form-item>
      </el-form>
    </div>
    <template>
      <el-table :data="searchObj" style="width: 100%"><!--v-loading="loading"-->
        <el-table-column prop="cardno" label="刮奖卡序号" width="180"></el-table-column>
        <el-table-column prop="tabCode.codeName" label="营业厅" width="180"></el-table-column>
        <el-table-column prop="tabGgcardObtain.svcid" label="业务类型" width="180"></el-table-column>
        <el-table-column prop="prizelevel" label="奖品等级"></el-table-column>
        <el-table-column prop="tabSaleplanGiftcode.giftname" label="奖品类型"></el-table-column>
        <el-table-column prop="tabGgcardObtain.optrdate" label="参与活动日期"></el-table-column>
        <el-table-column prop="optrdate" label="领取日期"></el-table-column>
        <el-table-column prop="tabHallUsermessage.pnumber" label="用户手机号"></el-table-column>
        <!--        <el-table-column fixed="right" label="操作" width="200">-->
        <!--          <template slot-scope="scope">-->
        <!--            <el-button @click="ReportDownloads()" type="primary" icon="el-icon-edit" size="small">导出当页数据</el-button>-->
        <!--&lt;!&ndash;            <el-button @click="handleClick(scope.row)" type="primary" icon="el-icon-edit" size="small">编辑</el-button>&ndash;&gt;-->
        <!--&lt;!&ndash;            <el-button type="danger" icon="el-icon-delete" size="small">删除</el-button>&ndash;&gt;-->
        <!--          </template>-->
        <!--        </el-table-column>-->
        <!-- 分页 -->
      </el-table>
    </template>
    <el-pagination
        :current-page="pageNo"
        :page-size="pageSize"
        :total="total"
        style="padding: 30px 0; text-align: center;"
        layout="total, prev, pager, next, jumper"
        @current-change="getList"
    />
  </div>
</template>
<script>
//引入api接口
import statistical from "../../api/statistical";

export default {
  // 定义数据模型
  data() {
    return {
      pageNo: 1,
      pageSize: 2,
      searchObj: [{
        cardno: null,
        tabGgcardObtain: [{
          svcid: null,
          optrdate: null,
        }],
        prizelevel: null,
        tabSaleplanGiftcode: [{
          giftname: null,

        }],
        optrdate: null,
        tabHallUsermessage: [{
          pnumber: null
        }],
        tabcode: [{
          codeName: null
        }]
      }],
      options:  [{
        value: null,
        label: '----请选择----'
      },{
        value: '43',
        label: '飞黄腾达营业厅'
      }, {
        value: '44',
        label: '望子成龙营业厅'
      }, {
        value: '45',
        label: '春天来了营业厅'
      }, {
        value: '46',
        label: '深留爱心营业厅'
      }]
      ,
      page: {
        pageNo: 1,
        pageSize: 2,
        acptsiteid: null,
        svcid: null,
        gifttype: null,
        obtainoptrdate: null,
        encashoptrdate: null
      },
      total: 0,
    }
  },
  // 页面渲染成功后获取数据
  created() {
    this.getList();
  },

  methods: {//定义方法对api接口的方法调用
    //医院设置列表
    getList(page = 1) {
      this.page.pageNo = page
      statistical.getSelectEncashAll(this.page)
          .then(res => {
            this.total = res.data.total
            this.searchObj = res.data.list
            console.log(res)
          })//请求成功
          .catch(error => {
            console.log(error)
          })//请求失败
    },
    //点击事件后先将this.page.obtainoptrdate时间戳转成String格式
    // ss() {
    //   if (this.page.obtainoptrdate != null && this.page.obtainoptrdate != '') {
    //     this.page.obtainoptrdate = this.Transformation(this.page.obtainoptrdate)
    //     this.page.obtainoptrdate = this.page.obtainoptrdate
    //   }
    //   if (this.page.encashoptrdate != null && this.page.encashoptrdate != '') {
    //     this.page.encashoptrdate = this.Transformation(this.page.encashoptrdate)
    //     this.page.encashoptrdate = this.page.encashoptrdate
    //   }
    // },
    onSubmit() {
      // this.ss();
      this.List();
    },
    List(page = 1) {
      this.page.pageNo = page
      statistical.getSelectEncashAll(this.page)
          .then(res => {
            this.total = res.data.total
            this.searchObj = res.data.list
            console.log(res)
          })//请求成功
          .catch(error => {
            console.log(error)
          })//请求失败
    },
    //获取的时间对象转字符串
    // Transformation(times) {
    //   var time = times;
    //   // var time1 = time.getTime();
    //   var date = new Date(time),
    //       Y = date.getFullYear() + '-',
    //       M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-',
    //       D = date.getDate() + ' '
    //   var current = Y + M + D
    //   return current
    // },
    ReportDownloads() {
      // alert(this.page.encashoptrdate)
      var msg = "确定要导出数据吗？";
      if (confirm(msg) == true) {
        window.location.href = "http://localhost:9527/userTest/tab-ggcard-encash/scratch/ReportOfPrizeExcelDownloads?" +
            "pageNo=" + this.page.pageNo+
            "&acptsiteid=" + this.page.acptsiteid+
            "&svcid=" + this.page.svcid+
            "&gifttype=" + this.page.gifttype+
            "&obtainoptrdate=" + this.page.obtainoptrdate+
            "&encashoptrdate=" + this.page.encashoptrdate;

      }
    }
  }
};
</script>
